<template>
  <div ref="perBg" class="personal-bg">
    <baseInfoCard />
    <examInfoCard />
    <el-tooltip placement="top" content="回到顶部">
      <back-to-top :custom-style="myBackTopStyle" :visibility-height="200" :back-position="0" transition-name="fade" />
    </el-tooltip>
  </div>
</template>

<script>

import studentBaseInfoCard from '@/views/personal/components/StudentBaseInfoCard'
import studentExamInfoCard from '@/views/personal/components/StudentExamInfoCard'
import BackToTop from '@/components/BackToTop'

export default {
  components: {
    baseInfoCard: studentBaseInfoCard,
    examInfoCard: studentExamInfoCard,
    backToTop: BackToTop
  },
  data() {
    return {
      myBackTopStyle: {
        right: '50px',
        bottom: '50px',
        width: '40px',
        height: '40px',
        'border-radius': '30px',
        'line-height': '45px', // 请保持与高度一致以垂直居中 Please keep consistent with height to center vertically
        background: 'rgb(64,158,255)'// 按钮的背景颜色 The background color of the button
      }
    }
  }
}
</script>

<style scoped>
.personal-bg {
  background-color: #f0f2f5;
  padding: 30px;
}

</style>
